import type { ArticleStylesKeys } from "@/store/modules/types";
import { selectedText } from "../../state";
import { useArticleStore } from "@/store/modules/article";
import { useNoteStore } from "@/store/modules/note";
import { TextStyleModifier } from "../../textStyleModifier";

const articleStore = useArticleStore();
const noteStore = useNoteStore();

export const hoverBarVisible = ref(false);
export const executeHoverBarFunctions: MyPartial<
  MyRecord<ArticleStylesKeys, () => void>
> = {
  note: noteStore.handleNoteFun,
  deleteLine: () => {
    exeHoverBarFn("deleteLine");
  },
  underLine: () => {
    exeHoverBarFn("underLine");
  },
  bold: () => {
    exeHoverBarFn("bold");
  },
};

function exeHoverBarFn(hoverBarType: ArticleStylesKeys) {
  const { uuid, changedContent } =
    TextStyleModifier.modifySelectedTextRangeStyle(
      selectedText.value,
      hoverBarType
    );
  const articleId = articleStore.getCurrentArticle!.id;
  articleStore.updateArticleHtmlContent(articleId, changedContent);
  articleStore.updateArticleStyle(articleId, uuid, {
    [hoverBarType]: true,
    text: selectedText.value,
  });
  articleStore.updateCurrentArticle(articleId);
  // articleStore.removeNoExistIdFromStyles();
}
